(function(){
var wid=$('#svgbox').width(),
	hei=$('#svgbox').height(),
	self=this,
	data=[],
	pathmin,pathmax,pathlang,
	linemax,timehour;
ajaxsd()
function ajaxsd(){
	$.ajax({
	type:"get",
	url:'http://api.huobi.com/staticmarket/btc_kline_001_json.js',
	dataType:'json',
	async:true,
	success:function(datasd){
		timehour=parseInt(datasd[datasd.length-1][0].substr(8,2));
		var timescend=parseInt(datasd[datasd.length-1][0].substr(10,2)),
			els=120-timescend,
			cle=300-els;
		datasd=datasd.splice(els,cle);
		console.log(datasd)
		pathmin=datasd[0][4];
		pathmax=datasd[0][4];
		linemax=datasd[0][5];
		$.map(datasd,function(val,i){
			pathmax=pathmax>val[4]?pathmax:val[4];
			pathmin=pathmin>val[4]?val[4]:pathmin;
			linemax=linemax>val[5]?linemax:val[5];
		})
		pathlang=(pathmax-pathmin).toFixed(2);
		data=datasd;
		init();
//		console.log(pathlang+'/'+pathmax+'/'+pathmin)
//		console.log(linelang+'/'+linemax+'/'+linemin)
		console.log(data)
	}
	});
};
setInterval(ajaxsd(),60000);

function makeSVG(tag, attrs) {
    var el= document.createElementNS('http://www.w3.org/2000/svg', tag);
    for (var k in attrs)
        el.setAttribute(k, attrs[k]);
    return el;
}
function init(){
	redline();
	picdark();
	linedark();
	circle();
}
var dsvg=$('#svgbox').find('g').eq(0),numBer=300,timeone=0.5,timetwo=0.7,pathhei=0.7,pathline=6;
bakc()
function bakc(){
	for(var i=0;i<pathline;i++){
		var henline=makeSVG('line', {x1: 0, x2: wid, y1:hei*pathhei/pathline*(i+1), y2:hei*pathhei/pathline*(i+1), stroke: '#f8f8f8'});
		dsvg.append(henline);
	}
	dsvg.find('text').eq(0).attr({'x':0,'y':hei*pathhei+14});
	dsvg.find('text').eq(1).attr({'x':wid/6*1,'y':hei*pathhei+14});
	dsvg.find('text').eq(2).attr({'x':wid/6*2+10,'y':hei*pathhei+14});
	dsvg.find('text').eq(3).attr({'x':wid/6*3+20,'y':hei*pathhei+14});
	dsvg.find('text').eq(4).attr({'x':wid/6*4+30,'y':hei*pathhei+14});
	dsvg.find('text').eq(5).attr({'x':wid-34,'y':hei*pathhei+14});
	for(var j=0;j<5;j++){
		var shulineone=makeSVG('line', {x1: wid/5*(j+1), x2: wid/5*(j+1), y1:0, y2:hei*pathhei-10, stroke: '#f8f8f8'});//11.30
		dsvg.append(shulineone);
	}
};
function redline(){	
	dsvg.find('text').eq(6).find('tspan').attr('y',0+10).html(pathmax);
	dsvg.find('text').eq(7).find('tspan').attr('y',hei*pathhei-15).html(pathmin);
	for(var j=0;j<6;j++){
		dsvg.find('text').eq(5-j).find('tspan').html((timehour+2)-j+':00');
	}
	console.log(pathmin+'/'+pathmax);
}
var osvg=$('#svgbox').find('g').eq(1),
	osvgline=osvg.find('path').eq(1),
	osvgpic=osvg.find('path').eq(0),
	last;
function picdark(){	
	var start=hei*pathhei/pathlang*(data[0][4]-pathmin),
		lineone="M 0,"+(hei*pathhei-start);
	$.map(data, function(val,i) {
		var bod=(val[4]-pathmin)*hei*pathhei/pathlang;
		//console.log(+'/'+)
		lineone+="L"+(i+1)*wid/numBer+","+(hei*pathhei-bod);
	});
	lineone=lineone+"L"+data.length*wid/numBer+","+hei*pathhei +"L"+0+","+hei*pathhei +"Z";
	
	var linetwo="M 0,"+(hei*pathhei-start);
	$.map(data, function(val,i) {
		var bod=(val[4]-pathmin)*hei*pathhei/pathlang;
		last=bod;
		linetwo=linetwo+"L"+(i+1)*wid/numBer+","+(hei*pathhei-bod);
	});
	osvgline.attr('d',linetwo);
	osvgpic.attr('d',lineone);
};
var linesvg=$('#svgbox').find('g').eq(2);
function linedark(){
	linesvg.find('line').remove();
	$.map(data, function(val,i) {
		var henline;
		if(val[5]>val[1]){
			henline=makeSVG('line', {x1:i*wid/numBer, x2: i*wid/numBer, y1:hei, y2:hei-(hei*0.3/linemax*val[5]), stroke: '#d0402d','stroke-width':wid/numBer/2});
		}else{
			henline=makeSVG('line', {x1:i*wid/numBer, x2: i*wid/numBer, y1:hei, y2:hei-(hei*0.3/linemax*val[5]), stroke: '#339958','stroke-width':wid/numBer/2});
		}
		linesvg.append(henline);
	});
};
function circle(){
	osvg.find('circle').remove();
	var circle= makeSVG('circle', {cx: data.length*wid/300, cy: (hei*pathhei-last), r:2, stroke: 'none', 'stroke-width': "none", fill: 'red'});
	osvg.append(circle);
}
})()
